import 'dart:math';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class XpockerTips extends AnimatedWidget {
  final String tips;
  final AnimationController controller;
  final Color textColor;
  final Color bottomColor;
  const XpockerTips(
      {Key key,
      this.tips: "位置提示",
      this.controller,
      this.textColor,
      this.bottomColor})
      : super(key: key, listenable: controller);
  Animation<double> get _progress => listenable;
  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: Alignment(0, 0.5),
      child: Opacity(
        opacity: _progress.value,
        child: Material(
          color: Colors.transparent,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(
                tips,
                style: TextStyle(
                    color: textColor, fontSize: 16.sp, fontFamily: "time_idly"),
              ),
              SizedBox(
                height: 5.h,
              ),
              ClipOval(
                child: Container(
                  height: 10,
                  width: 400.w,
                  decoration: BoxDecoration(
                      gradient: LinearGradient(
                          begin: Alignment.topCenter,
                          end: Alignment.bottomCenter,
                          stops: [
                        0.0,
                        0.4,
                        0.5,
                        0.6,
                        1.0
                      ], //[渐变起始点, 渐变结束点]
                          //渐变颜色[始点颜色, 结束颜色]
                          colors: [
                        bottomColor.withOpacity(0.2),
                        bottomColor.withOpacity(0.3),
                        bottomColor.withOpacity(0.5),
                        bottomColor.withOpacity(0.2),
                        bottomColor.withOpacity(0),
                      ])),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}
